import './App.css'
import { SelectedPage } from './shared/types'
import { useEffect, useState } from 'react'
import Navbar from './components/navbar'
import { Routes, Route } from 'react-router-dom'
import EquipmentApply from './pages/EquipmentApply'
import VenueManagement from './pages/VenueManagement'
import EventApply from './pages/EventApply'
import Home from './pages/Home'
import Footer from './components/footer'
// 导入新的用户管理页面
import Login from './pages/Login'
import Register from './pages/Register'
import UserManagement from './pages/UserManagement'
import ChangePassword from './pages/ChangePassword'
import PenaltyRules from './pages/PenaltyRules'
import Announcements from './pages/Announcements'
import AnnouncementModal from './components/AnnouncementModal'

function App() {
  const [selectedPage, setSelectedPage] = useState(SelectedPage.Home)
  const [isTopOfPage, setIsTopOfPage] = useState(true)
  const [currentUser, setCurrentUser] = useState(null)
  const [showAnnouncementModal, setShowAnnouncementModal] = useState(false)
  const [announcements, setAnnouncements] = useState([])

  useEffect(()=>{
    const handleScroll=()=>{
      if(window.scrollY===0){
        setIsTopOfPage(true)
        setSelectedPage(SelectedPage.Home)
      }
      if(window.scrollY!==0){
        setIsTopOfPage(false)
      }
    }
    window.addEventListener('scroll',handleScroll)
    return ()=>window.removeEventListener('scroll',handleScroll)
  },[])

  // 模拟获取公告数据
  useEffect(() => {
    const mockAnnouncements = [
      {
        id: '1',
        title: '健身房开放时间调整通知',
        content: '由于期末考试期间，健身房开放时间调整为：周一至周五 6:00-22:00，周末 8:00-20:00。请同学们合理安排锻炼时间。',
        type: 'notice',
        priority: 'high',
        isActive: true,
        isPinned: true,
        author: '健身房管理员',
        createdAt: '2024-09-20',
        updatedAt: '2024-09-20',
        publishDate: '2024-09-20',
        expireDate: '2024-12-31'
      },
      {
        id: '3',
        title: '2024年秋季健身大赛报名开始',
        content: '海大健身房2024年秋季健身大赛即将开始！比赛项目包括：引体向上、俯卧撑、平板支撑、跑步等。报名时间：9月20日-10月10日。',
        type: 'event',
        priority: 'high',
        isActive: true,
        isPinned: true,
        author: '活动组织者',
        createdAt: '2024-09-19',
        updatedAt: '2024-09-19',
        publishDate: '2024-09-19',
        expireDate: '2024-10-15'
      }
    ];
    setAnnouncements(mockAnnouncements);
  }, []);

  const handleLogin = (user: any) => {
    setCurrentUser(user)
    // 登录成功后显示公告
    setShowAnnouncementModal(true)
  }

  const handleLogout = () => {
    setCurrentUser(null)
  }

  return (
    <>
     <div className='app bg-gray-50'>
       <Navbar
        selectedPage={selectedPage}
        setSelectedPage={setSelectedPage}
        isTopOfPage={isTopOfPage}
        currentUser={currentUser}
        onLogout={handleLogout}
        ></Navbar>
     <Routes>
        <Route path="/"  element={<Home setSelectedPage={setSelectedPage} />} />
       <Route path="/equipment" element={<EquipmentApply />} />
       <Route path="/venues" element={<VenueManagement />} />
       <Route path="/events" element={<EventApply />} />
       {/* 新增的用户管理路由 */}
       <Route path="/login" element={<Login onLogin={handleLogin} />} />
       <Route path="/register" element={<Register />} />
       <Route path="/user-management" element={<UserManagement />} />
       <Route path="/change-password" element={<ChangePassword />} />
       <Route path="/penalty-rules" element={<PenaltyRules />} />
       <Route path="/announcements" element={<Announcements currentUser={currentUser} />} />
     </Routes>
     <Footer />
    </div>

    {/* 登录后弹出公告 */}
    {showAnnouncementModal && (
      <AnnouncementModal
        announcements={announcements}
        onClose={() => setShowAnnouncementModal(false)}
      />
    )}
    </>
   
  )
}

export default App
